<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../styles/common.css"/>
		<link rel="stylesheet" href="../status/font1/iconfont.css">
		<link rel="stylesheet" type="text/css" href="../status/font2/iconfont.css"/>
		<link rel="stylesheet" href="../styles/first.css">
		<link rel="stylesheet" type="text/css" href="../styles/swiper.min.css"/>
	</head>
	<script src="../conf/require.js" data-main="../scripts/first.js"></script>
	<body>
		<header></header>
			<!-- 第一个轮播图 -->
			<div class="swip">
				<div class="swiper-container" id="swiper1">
					<div class="_b"><a href="explor.html">立即购买</a></div>
					<div class="swiper-wrapper">
						<div class="swiper-slide">
							<img src="../status/img/swiper1.jpg" alt="" class="has">
						</div>
						<div class="swiper-slide"><img src="../status/img/swiper2.jpg" alt="" class="has"></div>
						<div class="swiper-slide"><img src="../status/img/swiper3.jpg" alt="" class="has"></div>
						<div class="swiper-slide"><img src="../status/img/swiper1.jpg" alt="" class="has"></div>
						<div class="swiper-slide"><img src="../status/img/swiper2.jpg" alt="" class="has"></div>
					</div>
					<div class="swiper-pagination"></div>
					<div class="col swiper-button-next"></div>
					<div class="col swiper-button-prev"></div>
					<div class="probar">
						<ul>
							<li>
								<div class="hide"></div>
								<div class="probar_box">
									<p>samsung</p>
									<p>Galaxy Fold</p>
								</div>
							</li>
							<li>
								<div class="hide"></div>
								<div class="probar_box">
									<p>Galaxy</p>
									<p>Note10+5G</p>
								</div>
							</li>
							<li>
								<div class="hide"></div>
								<div class="probar_box">画境系列融入图</div>
							</li>
							<li>
								<div class="hide"></div>
								<div class="probar_box">三性生活家电</div>
							</li>
							<li>
								<div class="hide"></div>
								<div class="probar_box">三星授权体验店</div>
							</li>
							<span class="iconfont icon-icon-up"></span>
							<span class="iconfont icon-zantingtingzhi"></span>
						</ul>
					</div>
				</div>
			</div>
			<!-- 标题 -->
			<div class="plor">
				<h3>探索Galaxy产品</h3>
			</div>
			<!-- 鼠标悬浮图片缩放 -->
			<div class="scale">
				<ul>
					<li>
						<a href="">
							<img src="../status/img/s4.jpg" alt="">
							<span class="iconfont icon-bofang"></span>
							<p>三星W20 5G发布会回放</p>
						</a>
					</li>
					<li><a href="">
						<img src="../status/img/s3.png" alt="">
					</a></li>
					<li>
						<a href="">
							<img src="../status/img/s1.png" alt="">
							<span class="iconfont icon-bofang"></span>
							<p>Galaxy S10+ | Note10 + 5G</p>
						</a>
					</li>
				</ul>
			</div>
			<!-- 好呀，又一个轮播图来了!!! -->
			
			<!-- 这是没写完的那换个 -->
			<div class="swiper_sec">
				<div class="title">
					<p><a>最新活动</a></p>
					<p><a>推荐</a></p>
					<p><a>热销产品</a></p>
				</div>
				<!-- 跟着的轮播 -->
				<div class="sure">
					<!-- 以下三个ul都是五张图 -->
						<ul>
							<li class="also_yi">
								<a href="" class="also_i">
									<img src="../status/ban/ban1.PNG" alt="立即购买">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href="" class="also_i_2">
									<img src="../status/ban/ban2.PNG" alt="立即购买">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href="" class="also_i_3"><img src="../status/ban/ban3.PNG" alt="在新窗口打开">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href=""  class="also_i_4"><img src="../status/ban/ban4.PNG" alt="立即购买">
							    <div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
								</li>
							<li>
								<a href=""  class="also_i_5"><img src="../status/ban/ban5.PNG" alt="在新窗口打开">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
						</ul>
						<ul>
							<li class="also_yi">
								<a href="" class="also_i_6">
									<img src="../status/ban/ban6.PNG" alt="立即购买">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href="" class="also_i">
									<img src="../status/ban/ban7.PNG" alt="立即购买">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href="" class="also_i_8"><img src="../status/ban/ban8.PNG" alt="在新窗口打开">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href=""  class="also_i_9"><img src="../status/ban/ban9.PNG" alt="立即购买">
							    <div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
								</li>
							<li>
								<a href=""  class="also_i_10"><img src="../status/ban/ban10.PNG" alt="在新窗口打开">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
						</ul>
						
							<ul>
							<li class="also_yi">
								<a href="" class="also_i">
									<img src="../status/ban/ban15.PNG" alt="立即购买">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href="" class="also_i_11">
									<img src="../status/ban/ban11.PNG" alt="立即购买">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href="" class="also_i_12"><img src="../status/ban/ban12.PNG" alt="在新窗口打开">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
							<li>
								<a href=""  class="also_i_13"><img src="../status/ban/ban13.PNG" alt="立即购买">
							    <div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
								</li>
							<li>
								<a href=""  class="also_i_14"><img src="../status/ban/ban14.PNG" alt="在新窗口打开">
									<div>了解更多<span class="iconfont icon-fenxiang"></span></div>
								</a>
							</li>
						</ul>
		
				</div>
			</div>
			
			<div class="search">
				<h2>我们能帮忙找点什么吗？</h2>
				<div class="_search">
					<input type="text" placeholder="Galaxy Note 10">
					<button><span class="iconfont icon-fangdajing"></span></button>
				</div>
			</div>
			<!-- 最后一块了，又是轮播图哇 -->
			<div class="swi_ban">
				<a href="">Explore #DoWhatYouCant</a>
				<div class="swi_ban_img">
					<div class="swiper-container" id="swiper2">
						<div class="col swiper-button-next"></div>
						<div class="swiper-wrapper">
							<div class="swiper-slide">
								<img src="../status/ban/swi4.PNG" alt="" class="has">
								<div class="jia"></div>
							</div>
							<div class="swiper-slide"><img src="../status/ban/swi2.PNG" alt="" class="has"></div>
							<div class="swiper-slide"><img src="../status/ban/swi1.PNG" alt="" class="has"></div>
							<div class="swiper-slide"><img src="../status/ban/swi3.PNG" alt="" class="has"></div>
							<div class="swiper-slide"><img src="../status/ban/swi5.PNG" alt="" class="has"></div>
						</div>
						<div class="col swiper-button-prev"></div>
					</div>
				</div>
			</div>
			<div class="pos">
				<div>
					<p class="p1">三星与Cookies</p>
					<p class="p2">为了能够给您提供更好的浏览体验，本网站会使用cookie，单击“接受”或
						继续浏览此网页，表示您同意我们使用cookie。<a href="">了解更多</a>
					</p>
				</div>
				<span class="iconfont icon-fork" id="icon"></span>
				<button>同意</button>
			</div>
		<footer></footer>
	</body>
	<script>
		window.onload=function(){
			let col = Array.from(document.getElementsByClassName("col"));
			let img = Array.from(document.getElementsByClassName("has"));
			img.forEach(function(item,index){
				 if(index==0 || index == 3){
				 	col.forEach(function(item,ind){
				 		col[ind].style.color = "#fff";
				 	})
				 }
			})
			let span = document.getElementById("icon");
			let pos = document.getElementsByClassName("pos")[0];
			span.addEventListener("click",function(){
				pos.style.display = "none";
			})
			
		}
	</script>
</html>
